<template>
    <view>
        <image src="../../static/imags/login/bg.png" class="bgimg"></image>
        
        <view :style="{'width':'100%','height':height}" class="liuhai"></view>
        <view class="appbar" :style="{'top':height}">
        	<view class="lefticon" @tap="goset"></view>
        	<span>听万歌 领万元</span>
        </view>
        <view :style="{'width':'100%','height':height}"></view>
        
        
        <view style="width: 100%;height: 110rpx;"></view>
        <view class="zhanghu">
            <view style="width: 100%;height: 10rpx;"></view>
            <view class="zhanghubiaoti">
                <view class="title">现金账户（元）</view>
                <view class="title" style="text-align: right;">金币账户</view>
            </view>
            <view style="width: 100%;height: 34rpx;"></view>
            <view class="coinbox">
                <view class="coin">{{ user.fen }}元</view>
                <view class="coin" style="text-align: right;border-left: 2px solid #4D69BF;">{{ user.coin }}</view>
            </view>
            <view style="width: 100%;height: 22rpx;"></view>
            <view class="duihuanbox">
                <view class="wenzi">{{ duihuan }}金币=1元</view>
                <view class="button" @tap="coin2fen"><image src="../../static/imags/set/dhxj.png"></image></view>
            </view>
        </view>
        <view style="width: 100%;height: 18rpx;"></view>
        <view class="caigebox">
            <view class="title">
                距离下次抽奖还差
                <span style="color: #FFBF00;">{{ user.tixiancaidui>needsong?1:needsong - user.tixiancaidui }}</span>
                首歌(剩余可抽奖次数{{ user.tixiannum }}次)
            </view>
            <view class="process">
                <view class="left">
                    <view class="jindutiaobox"><view class="jindutiao" :style="{ width: (user.tixiancaidui>needsong?(1/needsong):(user.tixiancaidui / needsong)) * 390 + 'rpx' }"></view></view>
                    <view class="miaoshu">猜歌即可抽奖！机会多多、金额不限！</view>
                </view>
                <view class="button" @click="openrole">
					<image src="../../static/imags/set/ljtx.png"></image>
				</view>
            </view>
        </view>
        <view style="width: 100%;height: 18rpx;"></view>
        <view class="caigebox">
            <view class="title">
                签到
            </view>
            <view class="process">
                <view class="left">
                    <view style="height: 20rpx;"></view>
                    <view class="miaoshu">您已连续签到{{user.lianxuqiandao}}天</view>
                </view>
                <view class="button" @click="qiandao">
        			<image src="../../static/imags/index/qiandao.png"></image>
        		</view>
            </view>
        </view>
        <view style="width: 100%;height: 18rpx;"></view>
        <view class="tixianbox">
            <view style="width: 100%;height: 13rpx;"></view>
            <view class="tixianbiaoti">
                <view class="title">常规提现</view>
                <view class="img" @tap="tixianjilu"><image src="../../static/imags/set/txjl.png" style="width: 105rpx;height: 33rpx;"></image></view>
            </view>
            <view style="width: 100%;height: 23rpx;"></view>
            <view class="moneybox">
                <view @tap="checkindex = index" :class="checkindex == index ? 'checkactive item' : 'item'" v-for="(item, index) in list" :key="index">
                    {{ item.coin }}元
                    <view class="biaoqian" v-if="item.index<3">{{item.index==1?'新手':'幸运'}}</view>
                </view>
            </view>
            <view class="tixian"><image src="../../static/imags/set/tx.png" mode="" @click="tixian"></image></view>
        </view>
        <view style="width: 100%;height: 23rpx;"></view>

        <view class="shuoming">
            <!-- <view>0.3元提现说明：</view>
            <view>新手专享，猜对5首歌曲即可领取</view> -->
            <view>[当前已经猜对歌曲数]：{{ user.leijicaiduigequ }}首</view>
            <view>[当前连续猜对歌曲数]：{{ user.leijiliandui }}首</view>
            <view>[当前累计观看视频数]：{{ user.leijikanshiping }}首</view>
        </view>
        
        <view style="width: 100%;height: 23rpx;"></view>
        
        <view class="shuoming">
            <view v-for="(item,index) in list" :key="index">
                <view v-if="item.index==1">{{item.coin}}元提现说明：新手专享，猜对5首歌曲即可领取</view>
                <view v-if="item.index==2">幸运{{item.coin}}元提现说明：每天观看{{item.video}}次激励视频即可领取</view>
                <view v-if="item.index>2 && item.index<10">
                    {{item.coin}}元提现说明：<span v-if="item.liandui>0">连对{{item.liandui}}首歌且</span>
                    <span v-if="item.video>0">累计观看视频{{item.video}}次且</span>
                    <span v-if="item.qiandao>0">连续签到{{item.qiandao}}天且</span>
                    <span v-if="item.leijicaidui>0">累计猜对{{item.leijicaidui}}首歌且</span>
                    仅可提现1次。
                </view>
				
				<view v-if="item.index>9">
				    {{item.coin}}元提现说明：<span v-if="item.liandui>0">连对{{item.liandui}}首歌且</span>
				    <span v-if="item.video>0">累计观看视频{{item.video}}次且</span>
				    <span v-if="item.qiandao>0">连续签到{{item.qiandao}}天且</span>
				    <span v-if="item.leijicaidui>0">累计猜对{{item.leijicaidui}}首歌</span>
				</view>
				
				
            </view>
        </view>
        <view style="width: 100%;height: 23rpx;"></view>
        <view class="shuoming1">
            注意事项：
            <br />
            1.由于微信提现支付需要实名制，非实名制用户账号无法支持提现，请务必将提现的微信号进行实名认证
            <br />
            2.单笔提现金额最低0.3元，最高2000元
            <br />
            3.提现申请通常1-3个工作日内审核到账，请您耐心等待，体谅一下客服妹子哦
            <br />
            4.0.3元提现是新人专享福利，每个账号可享受一次
            <br />
            5.如发现作弊，外挂等违规手段获取奖励，平台有权判定获得奖励无效
            <br />
        </view>
        <view style="width: 100%;height: 23rpx;"></view>

        <uni-popup ref="role">
            <!-- <pt-lottery
                ref="pt-lottery"
                lotteryBg="../../static/imags/set/lotteryBg.png"
                lotteryBtn="../../static/imags/set/lotteryBtn.png"
                :times="3"
                :prizeList="prizeList"
                :showTimes="false"
                @start="start"
                @end="end"
            ></pt-lottery> -->
			<almost-lottery
			        :prize-list="prizeList"
			        :ring-count="2"
			        :duration="1"
					:lineHeight="canvasData.lineheight",
					:fontSize="canvasData.fontsize",
					:strLineLen="2",
			        :canvas-width="canvasData.width"
			        :canvas-height="canvasData.height"
			        :prize-index="pageindex"
			        @reset-index="pageindex = -1"
			        @draw-start="handleDrawStart"
			        @draw-end="handleDrawEnd"
			        @finish="handleDrawFinish"
			        v-if="prizeList.length"
			      />
            <view style="width: 100%;height: 100rpx;" @tap='closerole'></view>
            <view class="roletitle">每次现金抽奖机会，均可随机抽取一次现金红包</view>
        </uni-popup>
        <view class="toast" v-if="showtoastdialog">{{ toasttitle }}</view>
        
        <uni-popup ref="huodetixian">
            <view class="huodemoney">
                <view class="close" @tap="closehuodetixian(1)"></view>
                <view style="width: 100%;height: 200rpx;"></view>
                <view class="title">
                    获得现金奖励
                    <span>{{rolecoin}}</span>
                    元
                </view>
                <view style="width: 100%;height: 60rpx;"></view>
                <!-- <view class="title1" style="font-size: 30rpx;">
                    距下次提现机会，还差
                    <span style="color: #F95300;">{{needsong - user.tixiancaidui}}</span>
                    关
                </view> -->
                <view class="title1" style="font-size: 30rpx;">当前可抽奖次数为<span style="color: #F95300;">{{user.tixiannum}}</span> <span v-if="user.tixiannum<=0">获得更多抽奖机会</span></view>
                <view style="width: 100%;height: 80rpx;"></view>
                <view class="button" @tap="closehuodetixian(2)">{{user.tixiannum>0?'继续抽奖':'继续猜歌'}}</view>
            </view>
        </uni-popup>
    </view>
</template>

<script>
export { default } from './mine.js';
</script>

<style>
@import url('./mine.css');
</style>
